<template>
    <div>

        <el-dialog
                title="新增"
                :visible.sync="dialogVisible"
                width="30%"
        ><el-form :label-position="labelPosition" :model="dmx" ref="dmx" :rules="rules" label-width="100px"  :inline="true"  class="demo-form-inline">
            <el-form-item label="代码名称:"  prop="dmmc" class="sbj">
                <el-input v-model="dmx.dmmc"  placeholder="请输入代码名称"></el-input>
            </el-form-item>
            <el-form-item label="代码值:" prop="dmz" class="sbj">
                <el-input v-model="dmx.dmz"  placeholder="请输入代码值"></el-input>
            </el-form-item>
            <el-form-item label="排序号:" prop="pxh" class="sbj">
                <el-input v-model="dmx.pxh"  placeholder="请输入排序号"></el-input>
            </el-form-item>
            <el-form-item label="是否可用:"  prop="sfky" class="sbj">
                <el-select v-model="dmx.sfky" placeholder="请选择是否可用">
                    <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="扩展字段1:" class="sbj">
                <el-input v-model="dmx.kzzd1"  placeholder="请输入扩展字段1"></el-input>
            </el-form-item>
            <el-form-item label="扩展字段2:" class="sbj">
                <el-input v-model="dmx.kzzd2"  placeholder="请输入扩展字段2"></el-input>
            </el-form-item>
            <el-form-item label="扩展字段3:" class="sbj">
                <el-input v-model="dmx.kzzd3"  placeholder="请输入扩展字段3"></el-input>
            </el-form-item>
        </el-form>
            <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="save">确 定</el-button>
          </span>
        </el-dialog>
    </div>
</template>

<script>
    import {jcggDmxAdd} from '@/api/app/xtgl0301/dmbgl.js'                 //引入新增接口

    export default {
        data(){
            return{
                labelPosition: 'right',
                dialogVisible:false,                                //定义弹框隐藏
                dmx:{
                    dmmc:null,
                    dmz:null,
                    pxh:null,
                    sfky:null,
                    kzzd1:null,
                    kzzd2:null,
                    kzzd3:null,
                },
                options: [{
                    value: '1',
                    label: '是'
                }, {
                    value: '0',
                    label: '否'
                }],
                sjdmid:null,
                dmflbs:null,
                rules:{
                    dmmc:[
                        { required: true, //是否必填
                            message: '代码名称不能为空', //规则
                            trigger: 'blur'  //何事件触发
                        }
                    ],
                    dmz:[
                        { required: true, //是否必填
                            message: '代码值不能为空', //规则
                            trigger: 'blur'  //何事件触发
                        }
                    ],
                    pxh:[
                        { required: true, //是否必填
                            message: '排序号不能为空', //规则
                            trigger: 'blur'  //何事件触发
                        }
                    ],
                    sfky:[
                        { required: true, //是否必填
                            message: '不能为空', //规则
                            trigger: 'change'  //何事件触发
                        }
                    ]
                }
            }
        },
        methods:{
            async save(){
                let parms ={
                    dmflbs:this.dmflbs,
                    sjdmid:this.sjdmid,
                    dmmc:this.dmx.dmmc,
                    dmz:this.dmx.dmz,
                    pxh:this.dmx.pxh,
                    sfky:this.dmx.sfky,
                    kzzd1:this.dmx.kzzd1,
                    kzzd2:this.dmx.kzzd2,
                    kzzd3:this.dmx.kzzd3,
                }
                let data = await jcggDmxAdd(parms)
                this.$emit('jcggDmxFindListByPage')                //为父类自定义标签引用，刷新列表数据
                this.hidden()                                     //隐藏方法
            },
            show(){                                               //显示方法
                for(let key in this.dmx){                      //清除弹框内容变
                    this.dmx[key]=""
                }
                this.dialogVisible = true
                this.$nextTick(() => {                         //清除弹框验证
                    this.$refs['dmx'].clearValidate()
                })
            },
            hidden(){                                             //隐藏方法
                this.dialogVisible = false
            },
        },
    }
</script>

<style scoped>
    @import "../../../../styles/app0301.scss";
    .sbj {
        margin-top: 15px;
    }

    .el-input,.el-select {
        width:100%!important;
    }
</style>